/*
 * vant-ui的样式覆盖请单独写在此文件
*/
/* 按钮边框颜色修改 */
@import "variables";

.van-button--default.van-button--plain {
    border-color: #d2d2d2;
}

.van-button--normal {
    border-radius: 10px;
}

.van-button--normal.van-button--hairline::after {
    border-radius: 20px; // 0.5px边框缩小了0.5倍圆角需设置为2倍
}

// 渐变按钮
.van-button--gradient {
    color: #fff;
    background: linear-gradient(90deg, #00B0E5 0%, #0097D2 100%);
    border: 0;
}

//primary 按钮颜色
.van-button--plain.van-button--primary {
    color: $pri_color_blue;
    border-color: $pri_color_blue;
}

//info 按钮颜色
.van-button--plain.van-button--info {
    color: $pri_color_blue;
    border-color: $pri_color_blue;
}


/* 去掉grid布局的边框 */
.van-grid {
    &.van-hairline--top::after {
        border-top: none;
    }

    [class*='van-hairline']::after {
        border: none;
    }
}

/* 设置grid 背景色 */
.van-grid {
    background: #ffffff;

    .van-grid-item {
        background: #ffffff;
    }

    .van-grid-item__content {
        background: transparent;
    }
}

/* dialog弹出框*/
.van-dialog {
    border-radius: 14px;

    .van-dialog__footer {
        .van-button--default {
            background: initial;
        }

        .van-dialog__confirm,
        .van-dialog__confirm:active {
            font-size: 16px;
            color: #0073b9;
        }
    }
}

/*tab标签页*/
.van-tabs {
    .van-sticky--fixed {
        top: 92px !important;
    }

    .van-tab {
        font-size: 24px;
    }

    .van-tab--active {
        color: #000;
    }

    .van-tab__pane {
        padding: 20px;
    }

    .van-tabs__line {
        background-color: #000;
        height: 4px;
    }
}

// Steps 步骤条
.van-steps.van-steps--vertical {

    // 去除竖向每个底边
    .van-step--vertical:not(:last-child)::after {
        border-bottom-width: 0;
    }
}

// tag标签的边线
.van-tag--plain {
    position: relative;
    border-color: #4e555b;
    border-radius: 4px;

    &::before {
        border: none;
    }
}

.van-tag--round {
    position: relative;
    @include border-1px($color: currentColor, $position: relative, $border-radius: 40px);

    &::before {
        border: none;
    }
}

// 表单内的van-cell样式
.van-form {
    margin-bottom: 32px;

    .van-cell {
        font-size: 16px;
        line-height: 20px;
        padding: 12px 18px;
    }

    .van-cell::after {
        right: 0;
    }

    .van-field__control[readonly='readonly'] {
        color: #999999;
    }

    .van-button {}
}

// 覆盖van-picker样式
.van-picker {
    .van-picker__cancel {
        color: #666666;
    }

    .van-picker__confirm {
        color: #0097d2;
    }
}

.van-index-bar {
    .van-index-bar__sidebar {
        .van-index-bar__index {
            line-height: 36px;
            // color: #999999;
        }
    }
}

// 开关开启背景颜色
.van-switch--on {
    background-color: $pri_color_blue;
}

// van-checkbox选中颜色
.van-checkbox__icon--checked .van-icon {
    background-color: $pri_color_blue;
    border-color: $pri_color_blue;
}

/*导航条样式定制*/
.van-nav-bar {
    background-color: #f19595;

    .van-nav-bar__text {
        color: #00B0E5;
    }

    .van-nav-bar__title {
        color: #fff;
    }

    .van-icon {
        color: #00B0E5;
    }
}

//tabbar标签页
.van-tabbar {
    z-index: 999;
    background-color: #d2d2d2;

    .van-tabbar-item--active {
        color: red;
    }

    .van-tabbar-item--active {
        background-color: rebeccapurple;
    }
}

// 轮播图
.van-swipe {
    padding: 0 10px;
    margin-top: 16px;
    height: 180px;

    .van-swipe__track {
        width: 100% !important;

        .van-swipe-item {
            width: 100% !important;

            img {
                height: 100%;
                width: 100%;
            }

            &+.van-swipe-item {
                margin-left: 20px;
            }
        }
    }

    .van-swipe__indicators {
        .van-swipe__indicator {
            height: 5px;
            width: 5px;
            border-radius: 5px;
        }

        .van-swipe__indicator--active {
            width: 12px;
        }
    }
}

// 分割线
.van-divider {
    color: red;
    font-size: 18px;
    border-color: red;
    border-style: dashed;
    border-width: 0;
    width: 240px;
    margin: 0 auto;
}

// 侧边导航
.van-sidebar {
    width: 90%;
    margin-left: 10px;

    .van-sidebar-item--select,
    .van-sidebar-item--select:active {
        background: gray;
        border-radius: 6px;
    }

    .van-sidebar-item--select::before {
        width: 0;
        height: 0;
    }

    .van-sidebar-item {
        padding: 20px 10px;
    }
}

// 日历
.van-calendar {
    background-image: linear-gradient(#cde631, #fff);

    .van-calendar__header {
        color: #000;

        .van-calendar__header-title {
            font-size: 18px;
        }

        .van-calendar__header-subtitle {
            font-size: 16px;
        }

        .van-calendar__weekdays {
            font-size: 14px;
        }
    }

    .van-calendar__body {
        .van-calendar__day {
            font-size: 14px;
        }

        .van-calendar__selected-day {
            background-color: #f19595;
        }

        .van-calendar__month-mark {
            color: #666666;
        }
    }

    .van-calendar__footer {
        .van-button--danger {
            background-color: #7a7203;
            border: #7a7203;
        }
    }
}
